<template>
  <el-dialog
    title="人工调整"
    :visible="dialogVisible"
    @open="openDialog"
    @close="closeDialog"
  >
    <el-form
      ref="form"
      :model="FormData"
    >
      <el-form-item>
        <el-row
          type="flex"
          justify="center"
        >
          <el-col :span="24">
            <el-radio-group
              v-model="FormData.workPatternType"
              @input="getSelectWorkHistoryList"
            >
              <el-radio
                label="1"
                style="font-weight: 700;"
              >礼拜制</el-radio>
              <el-radio
                label="2"
                style="font-weight: 700; "
              >连续制</el-radio>
            </el-radio-group>
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item
        label="模式名称："
        label-width="100px"
      >
        <el-row type="flex">
          <el-col :span="24">
            <el-select v-model="FormData.workPatternId">
              <el-option
                v-for="(item, index) in WorkHistoryList"
                :key="index"
                :label="item.name"
                :value="item.workPatternId"
              ></el-option>
            </el-select>
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item style="text-align: center">
        <el-button
          type="warning"
          @click="setWorkArrange"
        >确 定</el-button>
        <el-button
          type="warning"
          plain
          @click="closeDialog"
        >取 消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script>
import { selectWorkHistoryList, peopleSet } from '@/api/transit'
export default {
  name: 'WorkArrangeDialog',
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    selectedList: {
      type: Array,
      default: () => {
        []
      }
    }
  },
  data () {
    return {
      WorkHistoryList: [],
      FormData: {
        userIdList: [],
        workPatternId: null,
        workPatternType: '1',
        userType: ''
      }
    }
  },
  methods: {
    async openDialog () {
      await this.getSelectWorkHistoryList()
    },
    async getSelectWorkHistoryList () {
      this.WorkHistoryList = []
      const { data: res } = await selectWorkHistoryList()
      for (const key in res) {
        res[key].forEach(item => {
          if (+this.FormData.workPatternType === item.workPatternType) {
            this.WorkHistoryList.push({
              name: item.name,
              workPatternId: item.id
            })
          }
        })
      }
    },
    async setWorkArrange () {
      try {
        this.FormData.userIdList = [...this.selectedList]
        await peopleSet(this.FormData)
        this.$message.success('操作成功！')
        this.$emit('render')
        this.closeDialog()
      } catch (error) {
        console.log(error)
      }
    },
    closeDialog () {
      this.$emit('closeDialog')
      this.FormData.workPatternType = '1'
      this.FormData.workPatternId = null
    }
  }
}
</script>

